import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Radio, Spin } from 'antd';
import styles from './style.less';

class QuickQueryC extends Component {
  static defaultProps = {
    dataSource: [], // 数据源
    initialValue: '', // 默认无初始化值
    disabled: [], // 默认无禁用项
    onChange: () => {}, // 选择变更事件
    onRef: () => {}, // 本组件引用
    isInitOnchange: true,
  };

  constructor(props) {
    super(props);

    this.state = {
      currentValue: props.initialValue || ((props.data && props.data[0]) || {}).value,
    };
  }

  UNSAFE_componentWillReceiveProps(nextProps) {
    if (this.props.initialValue !== nextProps.initialValue || JSON.stringify(this.props.dataSource) !== JSON.stringify(nextProps.dataSource)) {
      this.setState({
        currentValue: nextProps.initialValue || ((nextProps.dataSource && nextProps.dataSource[0]) || {}).value,
      });
    }
  }

  componentDidMount() {
    // 父组件对本组件的引用
    this.props.onRef(this);

    const value = this.props.initialValue || ((this.props.data && this.props.data[0]) || {}).value;
    this.props.isInitOnchange && this.props.onChange(value);
  }

  // 外部组件调用，更改选项
  setSelect(value) {
    this.setState({
      currentValue: value,
    });

    // 抛出变更事件
    this.props.onChange(value);
  }

  // 响应选项变更
  onChange = (e) => {
    const value = e.target.value;
    this.setState({
      currentValue: value,
    });

    // 抛出变更事件
    this.props.onChange(value);
  };

  render() {
    const { dataSource, disabled } = this.props;
    const { currentValue } = this.state;

    return (
      <div className={styles.quickQuery}>
        {dataSource && dataSource.length > 0 ? (
          <Radio.Group value={currentValue} onChange={this.onChange}>
            {dataSource &&
              dataSource.map((item) => (
                <Radio.Button value={item.value} key={item.value} disabled={disabled.indexOf(item.value) > -1}>
                  {item.title}
                </Radio.Button>
              ))}
          </Radio.Group>
        ) : (
          <Spin />
        )}
      </div>
    );
  }
}

QuickQueryC.propsTypes = {
  dataSource: PropTypes.array.isRequired, // 数据源，格式：[{value:'',title:''}]
  initialValue: PropTypes.string, // 初始化值
  onChange: PropTypes.func, // 选中变更事件
  disabled: PropTypes.array, // 禁用选项[禁用项的value]
  isInitOnchange: PropTypes.bool, // 是否进来就执行onChange事件， 默认是，
};

export default QuickQueryC;
